<!doctype html>
<style>
svg {
  border: 1px solid black;
}
#img4 {
  display: none;
}
</style>
<svg id="s1" width="20px" height="20px">
  <image id="img1" href="resources/pattern.png" x="0" y="0" width="20px" height="20px" />
</svg>
<svg id="s2" width="20px" height="20px">
  <image id="img1" href="resources/pattern.png" x="10" y="10" width="20px" height="20px" />
</svg>
<svg id="s3" width="20px" height="20px">
  <image id="img3" href="resources/pattern.png" x="0" y="0" width="20px" height="20px" />
</svg>
<svg id="s4" width="20px" height="20px">
  <image id="img4" href="invalid" x="0" y="0" width="20px" height="20px" />
</svg>
<svg id="s5" width="20px" height="20px">
</svg>
<svg id="s6" width="20px" height="20px">
  <image href="resources/rect.svg" x="0" y="0" width="20px" height="20px" />

</svg>
<svg id="s7" width="20px" height="20px">
</svg>
<svg id="s8" width="20px" height="20px">
</svg>
